<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8" />
    <title>编辑接口</title>
    <link rel="stylesheet" type="text/css" media="all" href="/layui/css/layui.css"/>
    <script type="text/javascript" src="/layui/layui.all.js"></script>
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/myJs.js"></script>

</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>编辑接口</legend>
</fieldset>

<div class="layui-container">
    <!--6/12 布局-->
    <div class="layui-row">
        <div class="layui-col-xs6">
            <form id="ApiDetail" class="layui-form layui-form-pane"><br/><br/><br/>
                <!--ID-->
                <div class="layui-form-item">
                    <label class="layui-form-label">ID</label>
                    <div class="layui-input-inline" style="width: 300px">
                        <input  style="height: 38px" type="text" name="relationID" th:value="${tc.relationID}" readonly="readonly" autocomplete="off" class="layui-input layui-badge" />
                    </div>
                </div>

                <!--<div class="layui-form-item">-->
                    <!--<label class="layui-form-label ">url</label>-->
                    <!--<div class="layui-input-inline" style="width: 300px;">-->
                        <!--<input type="text" name="url" autocomplete="off" th:value="${tc.url}" class="layui-input" />-->
                    <!--</div>-->
                <!--</div>-->
                <div class="layui-form-item">
                    <label class="layui-form-label">url</label>
                    <div class="layui-input-inline" style="width: 300px;">
                        <datalist id="apiSelect">

                        </datalist>
                        <input type="text" list="apiSelect" th:value="${tc.url}" name="url" autocomplete="off" class="layui-input"/>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label ">登录人</label>
                    <div class="layui-input-inline" style="width: 300px;">
                        <input type="text" name="loginName" autocomplete="off" th:value="${tc.loginName}" class="layui-input" />
                    </div>
                </div>
                <!--负责人-->
                <div class="layui-form-item">
                    <label class="layui-form-label ">执行顺序</label>
                    <div class="layui-input-inline" style="width: 300px;">
                        <input type="text" name="runOrder" autocomplete="off" th:value="${tc.runOrder}"  class="layui-input" />
                    </div>
                </div>

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label" style="width: 410px">断言</label>
                    <div class="layui-input-block">
                        <textarea name="shouldbe" th:field="${tc.shouldbe}" style="height: 150px;width: 410px;" class="layui-textarea"></textarea>
                    </div>
                </div>

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label" style="width: 410px">请求参数</label>
                    <div class="layui-input-block">
                        <textarea name="body" style="height: 150px;width: 410px;" th:field="${tc.body}"  class="layui-textarea"></textarea>
                    </div>
                </div>
                <!--备注-->
                <br/>
                <!--提交按钮-->
                <button type="button" style="width: 410px" class="layui-btn" lay-filter="add" id="add" lay-submit="">提交</button>
            </form>
        </div>
    </div>
</div>


</body>
<script>
    $.get(
        "/api/scene/apiSelect", {

        }, function (data) {
            var objectD = JSON.parse(data);
            $.each (objectD.rows, function (key, value) {
                var result = '<option value="' + value.url + '">' + value.url + '</option>';
                $('#apiSelect').append(result);
            })
            layui.use('form', function(){
                var form = layui.form;
                form.render();
            });
        }
    )

    layui.use('form', function () {
        var form = layui.form;
        form.render();
        //监听提交
        form.on('submit(add)', function (data) {

            var from = $("#ApiDetail");
            var model = serializeObject(from);

            $.ajax({
                type: "post",
                url: "/api/scene/updateAPI",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(model),
                dataType: "json",
                success: function (data) {
                    if (data == "true") {
                        layer.confirm('修改成功', function (index) {
                            window.close();
                        });
                    }
                    if (data == "false") {
                        layer.alert("修改失败")
                    }
                    if (data == "接口库中无此接口"){
                        layer.alert("接口库中无此接口");
                    }
                }
            })
            return false;
        });
    });
</script>
</html>